<html xmlns="http://www.w3.org/1999/xhtml">
<head>
 <title>LZXリファレンス lzhistory</title>
  <othercredit role="translator">
    <firstname>Atuo</firstname>
    <surname>Seki</surname>
        <contrib>2006/05/17　翻訳初版</contrib>
 </othercredit>
<link rel="STYLESHEET" type="text/css" href="./styles.css" /></head>
<body>

<!-- ===================================================================== -->
<!-- = XML information goes here                                         = -->
<!-- ===================================================================== -->
<lzelement title="View">
    <lztier>Service</lztier>
    <lzcategory>Event</lzcategory>
    <lzshortdesc>
              ブラウザの履歴とBackボタンの相互作用の管理。
    </lzshortdesc>
    <lzapi>api-lzhistory.xml</lzapi>
</lzelement>

<p>注意:LzHistoryを使用するためにwrapper HTMLで lzt=history を加えなければなりません。</p>
<p>LzHistoryサービスはブラウザの履歴とBackボタンの相互作用を管理します。
好きな時何回でも状態を保存でき、新しいページを得た時は履歴を進めます。</p>

<!--example class="code">
&lt;canvas width="1400" height="600" debug="true"&gt;
  &lt;debug width="500" height="500" fontsize="12" x="450"/&gt;
b
  &lt;class name="blob" extends="drawview" width="100" height="100"&gt;
    &lt;attribute name="title" type="text"/&gt;
    &lt;attribute name="selected" type="boolean" /&gt;
    &lt;text y="20" x="4" fontsize="16" text="${parent.title}"/&gt;
    &lt;method event="onclick"&gt;
      this.setAttribute('selected', true);
      main.selectBlob(this);
    &lt;/method&gt;

    &lt;method name="select" args="val"&gt;
      if (val) {
      // draw a border to select
        this.lineStyle = 0x000000;
        this.lineWidth = 4;
        moveTo(0,0);
        lineTo(0,100);
        lineTo(100,100);
        lineTo(100,0);
        lineTo(0,0);
        stroke();
      } else {
        clear();
      }
    &lt;/method&gt;
  &lt;/class&gt;

  &lt;view id="main" x="10" y="10"  layout="axis: x; spacing: 10"&gt;
    &lt;attribute name="mystate" type="string" value="START"/&gt;

    &lt;blob bgcolor="#ffcccc" id="s1" title="START"/&gt;
    &lt;blob bgcolor="#ccccff" id="s2" title="STATE_2"/&gt;
    &lt;blob bgcolor="#ccffcc" id="s3" title="STATE_3"/&gt;
    &lt;blob bgcolor="#cccccc" id="s4" title="END"/&gt;

    &lt;method name="unselectAll"&gt;
      s1.select(false);
      s2.select(false);
      s3.select(false);
      s4.select(false);
    &lt;/method&gt;

    &lt;method name="selectBlob" args="blob"&gt;
      // save the old state
      LzHistory.next();
      setAttribute('mystate', blob.title);
      unselectAll();
      blob.select(true);
      recordState(blob.title);
    &lt;/method&gt;

    &lt;method event="oninit"&gt;
      unselectAll();
      recordState("START");
      selectBlob(s1);
    &lt;/method&gt;

    &lt;method name="recordState" args="newstate"&gt;
      this.mystate = newstate;
      LzHistory.save(this,'mystate', this.mystate);
      Debug.write("saved", newstate)
    &lt;/method&gt;

    &lt;method name="gotoState" event="onmystate" args="ns"&gt;
      Debug.write("received state event from the browser: ", this.mystate);
      unselectAll();
      if (ns == "START") {
          s1.select(true);
      } else if (ns == "STATE_2") {
          s2.select(true);
      } else if (ns == "STATE_3") {
          s3.select(true);
      } else if (ns == "END") {
          s4.select(true);
      }
    &lt;/method&gt;
  &lt;/view&gt;
&lt;/canvas&gt;
</example>

<p>LzHistory also receives canvas attribute requests from the browser JavaScript method <method>lzSetCanvasAttribute('attrname', attrvalue)</method>.
 </p> 
<p>For example, to set the foo attribute on the canvas no 0 or 1, include this HTML in a copy of the lzt=history wrapper HTML:</p>
-->
<example extract="false">
&lt;form&gt;
    &lt;input type="button" value="0" onclick="lzSetCanvasAttribute('foo', 0)"/&gt; 
    &lt;input type="button" value="1" onclick="lzSetCanvasAttribute('foo', 1)"/&gt; 
&lt;/form&gt;
</example>

</body>
</html>
<!-- * X_LZ_COPYRIGHT_BEGIN ***************************************************
* Copyright 2001-2004 Laszlo Systems, Inc.  All Rights Reserved.              *
* Use is subject to license terms.                                            *
* X_LZ_COPYRIGHT_END ****************************************************** -->
